<div class="tableform newOrder">
  <h3>新建销售单</h3>
  <form action="index.php?app=ome&ctl=admin_order&act=doAddSaleOrder" method="post" class="division" id="newOrderForm">
    <input type="hidden" id="hid_branch_id" name="branch_id" value="<{$branch.branch_id}>" />
    <div class="gray_form">
      <p><strong>1.添加会员</strong> <select id="add_mem_sel"><option value="uname">按用户名</option><option value="mobile">按手机号</option></select><span style="position:relative;"><input type="text" name="uname" id="ipt_data" /></span> <{button label="搜索" id="btn_search_member"}>  <{button label="新建用户" id="btn_new_member" onclick="new Dialog('index.php?app=ome&ctl=admin_member&act=addMember',{width:700,title:'新建用户',height:400})"}></p>
      <table class="gridlist" style="*width:97%;">
        <thead>
          <tr>
            <th style="width:20px;"></th>
            <th>用户名</th>
            <th>性别</th>
            <th>手机号</th>
            <th>地区</th>
            <th>Email</th>
          </tr>
        </thead>
        <tbody id="memNode">

        </tbody>
      </table>
    </div>
    <div class="gray_form" style="margin-top:24px;">
      <p class="clearfix"><strong class="fl">2.添加订单商品 <{button label="从商品库添加商品" id="btn_add_product" disabled="disabled"}> <{button label="添加捆绑商品" id="btn_add_product_pkg" disabled="disabled"}> </strong> <span class="fr"> 按货号添加:<input type="text" name="product_bn" disabled="disabled" /> 按商品名添加:<input type="text" name="product_name" disabled="disabled" /> <!--<{button type="button" label="添加" id="btn_add" disabled="disabled"}>--></span></p>
      <table class="gridlist" style="*width:97%;">
        <thead>
          <tr>
            <th>销售物料编码</th>
            <th>销售物料名称</th>
            <th style="width:30px;">规格</th>
            <th style="width:55px;">库存数量</th>
            <th>购买数量</th>
            <th>物料价格</th>
            <th style="width:30px;">删除</th>
          </tr>
        </thead>
        <tbody id="proNode">

        </tbody>
      </table>
    </div>
    <div class="gray_form" style="margin-top:24px;">
      <p><strong>3.选择配货地址</strong></p>
      <ul class="addrlist" id="addrlist">

      </ul>
      <input type="hidden" name="consignee[addr]" id="consignee_addr" value="" />
      <input type="hidden" name="consignee[name]" id="consignee_name" value="" />
      <input type="hidden" name="consignee[zip]" id="consignee_zip" value="" />
      <input type="hidden" name="consignee[mobile]" id="consignee_mobile" value="" />
      <input type="hidden" name="consignee[telephone]" id="consignee_telephone" value="" />
      <input type="hidden" name="consignee[email]" id="consignee_email" value="" />

      <p><{button label="使用新的配货地址" id="btn_add_address" onclick="new Dialog('index.php?app=ome&ctl=admin_order&act=addNewAddress',{title:'添加配货地址',width:750,height:300})" disabled="disabled"}></p>
      <p>订单附言：<input type="text" name="customer_memo" size="90" />
    </div>
    <div class="gray_form" style="margin-top:24px;">
      <p><strong>4.选择快递公司</strong> </p>
      <ul class="branch_list clearfix" id="deliverylist">

      </ul>
    </div>
    <div class="gray_form" style="margin-top:24px;">
      <p><strong>5.订单信息确认</strong></p>
      <table border="0" style="width:auto;">
        <tbody>
          <tr>
            <th>商品总金额：</th>
            <td name="goods_amount">0</td>
            <th>下单日期：</th>
            <td name="times">2010-10-19</td>
          </tr>
          <tr>
            <th>订单总金额：</th>
            <td name="order_amount">0</td>
            <th>快递公司：</th>
            <td name="delivery"></td>
          </tr>
          <tr>
            <th>折扣：</th>
            <td><input type="text" name="discount" size="6" vtype="number" /></td>
            <th>配送金额：</th>
            <td><input type="text" name="cost_shipping" vtype="number" size="5" /></td>
          </tr>
          <tr>
            <th>订单备注：</th>
            <td><textarea rows="6" cols="50" name="order_memo"></textarea></td>
            <th>快递单号：</th>
            <td><input type="text" name="logi_no" vtype="required" /></td>
          </tr>
        </tbody>
      </table>
    </div>

    <div class="table-action">
      <{button type="button" class="btn-secondary" id="btn_submit" label="提交" disabled='disabled'}>&nbsp;&nbsp;
      <!-- <{button type="button" class="btn-secondary" id="preview" label="预 览" disabled='disabled'}> &nbsp;&nbsp; <{button type="button" class="btn-secondary" label="返 回"}> -->
    </div>
  </form>
</div>
<script>
  (function(){
    $('add_mem_sel').addEvent('change',function(){
      $('ipt_data').name = this.get('value');
    });

    $('ipt_data').addEvent('enter',function(e){
      //if(e.key=='enter'){
        $('btn_submit').removeEvent('focus').blur();
        e.stop();
        new Request({url:'index.php?app=ome&ctl=admin_order&act=getMembers',method:'post',data:this.name+'='+this.value.trim(),
          onSuccess:function(json){
            if (!json){
              $('memNode').set('html','');
              $('addrlist').set('html','');
              $$('.nodisabled').removeClass('nodisabled').set('disabled',true);
              return;
            }
            json = JSON.decode(json);
            $$('.nodisabled').removeClass('nodisabled').set('disabled',true);
            createMember(json);
          }
        }).send();
      //}
    });

    $('btn_search_member').addEvent('click',function(e){
      if($('ipt_data').value !== ''){
        _this = $('ipt_data');
        new Request({url:'index.php?app=ome&ctl=admin_order&act=getMembers',method:'post',data:_this.name+'='+_this.value,
          onSuccess:function(json){
            if (!json){
              $('memNode').set('html','');
              $('addrlist').set('html','');
              $$('.nodisabled').removeClass('nodisabled').set('disabled',true);
              return;
            }
            json = JSON.decode(json);
            $$('.nodisabled').removeClass('nodisabled').set('disabled',true);
            createMember(json);
          }
        }).send();
      }
    });




    function sumOrderAmount(){
      var goods=parseFloat($E('td[name=goods_amount]').get('text'))||0;
      var pmt=parseFloat($E('input[name=discount]').value)||0;
      var cost=parseFloat($E('input[name=cost_shipping]').value)||0;

      $E('td[name=order_amount]').set('text',( goods + cost + pmt).toFixed(3));
    }
    //$('preview').addEvent('click',function(){
      //validate($('newOrderForm'));
      //});

    var callurl='index.php?app=ome&ctl=admin_order&act=getProducts', store=[];
    var callurlpkg='index.php?app=omepkg&ctl=admin_pkg&act=getPkgGoods', store=[];
    var options={
      'getVar':'bn',
      'delay':800,
      'fxOptions':false,
      callJSON:function(){return window.autocompleter_json;},
      injectChoice:function(json){
        var choice = new Element('li', {'html': this.markQueryValue(json[this.options.getVar])});
        choice.store('_data',json);
        choice.inputValue = json[this.options.getVar];
        this.addChoiceEvents(choice).inject(this.choices);
      },
      onHide:function(){
        if(!this.selected)return;
        var _json=this.selected.retrieve('_data');
        _json=$splat(_json);
        init(_json);
      },
      onFocus:function(ipt){
      }
    };

    new Autocompleter.script($E('[name=product_bn]'),callurl, options);
    new Autocompleter.script($E('[name=product_name]'),callurl,$merge(options,{'getVar':'name'}));
    /*
    * $('product_add').addEvent('change',function(){
      *   $E('input[name=product_bn]').toggleDisplay();
      *   $E('input[name=product_name]').toggleDisplay();
      * });
    */

    function getTemp(j,flag){
      var checked=flag?'checked="checked"':'';
      return '<tr><td><input type="radio" name="id" value="'+j.member_id+'" '+checked+' /></td><td>'+j.uname+'</td><td>'+j.sex+'</td><td>'+j.mobile+'</td><td>'+j.area.split(':')[1]+'</td><td>'+j.email || ''+'</td></tr>';
    }

    var fdoc=document.createDocumentFragment();
    function createMember(data){
      var rows='';
      data.each(function(item){
        rows+=getTemp(item);
      });
      $('memNode').set('html',rows);

      function getAddrTemp(j){
        return '<li><q><input type="radio" name="address_id" value="'+j.area+'" /> '+j.addr+'</q> <b>'+j.name+'</b> <i>'+j.zip+'</i> <em>'+j.mobile+'</em> &nbsp; &nbsp; &nbsp; <span>'+j.telephone+'</span> &nbsp; &nbsp; &nbsp;  <strong>'+j.email+'</strong></li>';
      }
      function getDeliveryTemp(j){
        return '<li><input type="radio" name="logi_id" value="'+j.corp_id+'" /> <label>'+j.name +'</label></li>';
      }

      $ES('input[name=id]').addEvent('click',function(e){
        $$('*[disabled]').addClass('nodisabled').set('disabled',false);

        new Request({url:'index.php?app=ome&ctl=admin_order&act=getMemberAddress',method:'post',data:'member_id='+this.value,
          onSuccess:function(json){
            if (!json){
              $('addrlist').set('html','');
              return false;
            }
            json = JSON.decode(json);
            var lists='';
            json.each(function(j){
              lists+=getAddrTemp(j);
            });
            $('addrlist').set('html',lists);

            $$('input[name=address_id]').addEvent('click',function(){
              var _this=this;
              new Request({url:'index.php?app=ome&ctl=admin_order&act=getCorpArea',method:'post',data:_this.name+'='+_this.value,
                onSuccess:function(json){

                  json = JSON.decode(json);
                  var Delist='';
                  json.each(function(j){
                    Delist += getDeliveryTemp(j);
                  });
                  $('deliverylist').setHTML(Delist);
                  $('deliverylist').getElements('input[name=logi_id]').addEvent('click',function(){
                    $E('td[name=delivery]').set('text',this.getParent('li').getElement('label').get('text'));
                  });

                  $('consignee_addr').value=_this.getParent('li').getElement('q').get('text').trim();
                  $('consignee_name').value=_this.getParent('li').getElement('b').get('text').trim();
                  $('consignee_zip').value=_this.getParent('li').getElement('i').get('text').trim();
                  $('consignee_mobile').value=_this.getParent('li').getElement('em').get('text').trim();
                  $('consignee_telephone').value=_this.getParent('li').getElement('span').get('text').trim();
                  $('consignee_email').value=_this.getParent('li').getElement('strong').get('text').trim();
                }
              }).send();
            });
          }
        }).send();
      });
    }

    $('deliverylist').getElements('input[name=logi_id]').addEvent('click',function(){
      $E('td[name=delivery]').set('text',this.getParent('li').get('text').trim());
    });

    function searchMember(data){
      new Request({url:'index.php?app=ome&ctl=admin_order&act=getMembers',method:'post',data:'member_id='+data.member_id,
        onSuccess:function(json){
          json = JSON.decode(json);
          createMember(json);
        }
      }).send();
    }

    var pag;
    var tpl='<tr key="{product_id}" id="goods_{product_id}">\
        <td>{bn}</td>\
        <td>{name}</td>\
        <td>{spec_info}</td>\
        <td>{store}</td>\
        <td><input type="text" value="{num}"  key="num" vtype="number&amp;&amp;required" tname="num[_PRIMARY_]" size="6"></td>\
        <td><input type="text" value="{price}" key="price"  vtype="number&amp;&amp;required"  tname="price[_PRIMARY_]" size="6">元</td>\
        <td><{img src="bundle/delecate.gif" app="desktop" key="state" class="pointer btn_delete"}></td>\
      </tr>';

    function createProduct(data){
      pag=new PageData(tpl,data,{'updateMain':$('proNode'),'pageNum':5,
        'onShow':function(){
          var _this=this;
          $$('#proNode input[type]').addEvent('change',function(e){
            var pid=this.getParent('tr').get('key'),value=this.value;
            _this.editData(pid,[this.get('key'),value]);
          });
          rows=$$('#proNode tr');
          rows.each(function(item,i){
            item.getElement('.btn_delete').addEvent('click',function(e){
              if(_this.selectData(item.get('key')) && confirm('确定要删除 '+ _this.selectData(item.get('key'))['name'] +' 吗？')) _this.delData(item.get('key'));
            });
            item.getElement('input[key=price]').addEvent('blur',function(){
              var notice;
              if(!this.value.test(/\d+/)) notice=new Element('span.error',{html:'请输入数值！'}).injectAfter(this);
              else {
                var sum=0;
                rows.each(function(el,i){
                  sum+=el.getElement('input[key=num]').value*el.getElement('input[key=price]').value;
                });
                $E('td[name=goods_amount]').set('text',sum.toFixed(3));
                sumOrderAmount();
              }
            });

            item.getElement('input[key=num]').addEvents({
              'keypress':function(e){
                if(e.code==13) item.getElement('input[key=price]').focus();

              },
              'blur':function(){
                var notice;

                if(!this.value.test(/\d+/)) {
                  notice=new Element('span.error',{html:'请输入数值！'}).injectAfter(this);
                  notice.destroy.delay(4000,notice);
                  return;
                }
                if(this.value.toInt() > this.getParent('td').getPrevious().get('text').trim().toInt()){
                  notice=new Element('span.error#notice_err',{html:'购买数量超出库存数量！'}).injectAfter(this);
                  }else {
                  if($('notice_err')) $('notice_err').destroy();
                }

                var sum=0;
                rows.each(function(el,i){
                  sum+=el.getElement('input[key=num]').value*el.getElement('input[key=price]').value;
                });
                $E('td[name=goods_amount]').set('text',sum.toFixed(3));
                sumOrderAmount();
              },
              'focus':function(){
                if(this.getNext('.notice')) this.getNext('.notice').destroy();
              }
            });
          });
          //var len = this.data.length ? (this.data.length > this.options.pageNum ? (this.options.current == this.getTotal() ? this.data.length-this.options.pageNum*(this.options.current-1) : this.options.pageNum) : this.data.length) : 0;
          if(this.data.length) rows[0].getElement('input[key^=num]').focus();
        }
      });
    }

    $('btn_add_product').addEvent('click',function(e){
      var url='index.php?app=desktop&act=alertpages&goto='+encodeURIComponent('index.php?app=ome&ctl=admin_order&act=findProduct&branch_id='+$('hid_branch_id').value);
      new finderDialog(url,{params:{url:callurl,name:'product_id[]'},width:1000,height:660,
        onCallback:function(rs){
          if(!rs)return;
          rs=JSON.decode(rs);
          init(rs);
        }
      });
    });

    $('btn_add_product_pkg').addEvent('click',function(e){
      var url='index.php?app=desktop&act=alertpages&goto='+encodeURIComponent('index.php?app=omepkg&ctl=admin_pkg&act=findPkgProduct');
      new finderDialog(url,{params:{url:callurlpkg,name:'goods_id[]'},width:1000,height:660,
        onCallback:function(rs){
          if(!rs)return;
          rs=JSON.decode(rs);
          init(rs);
        }
      });
    });

 $('btn_submit').addEvent('click',function(e){
      var tip;
      if(! validradio('input[name=id]','请先选择会员')) return;
      if( $('proNode').getHTML().trim() === '') {
        tip=new Element('span.error',{html:'请先添加商品'}).injectAfter($('btn_add_product').getParent());
        tip.destroy.delay(4000,tip);
        MessageBox.error('表单验证失败:请先添加商品');
        e.stop();
        return;
      }
      if(! validradio('input[name=address_id]','请选择收货地址')) return;
      if($E('td[name=delivery]').get('text').trim()===''){
        tip=new Element('span.error',{html:'请选择快递公司'}).injectAfter($E('input[name=logi_id]').getParent('.gray_form').getElement('strong'));
        tip.destroy.delay(4000,tip);
        $E('input[name=logi_id]').focus();
        MessageBox.error('表单验证失败:请选择快递公司');
        return false;
      }

      var _this=this;
      var form=this.getParent('form');
      if(pag){
          var data=pag.toHideInput($('proNode').getElement('tr'));
          form.store('target',{extraData:data});
      }
      form.fireEvent('submit',e);
    });
    function init(rs){
      var tmparr=findProduct(rs,'product_id');
      store.unshift.apply(store,tmparr.reverse());
      createProduct(store);
    }
    function findProduct(arr,PRIMARY){
      if(!store.length)return arr;
      store.each(function(a){
        arr.each(function(b){
          if(a[PRIMARY]==b[PRIMARY])arr.erase(b);
        });
      });
      return arr;
    }

    $$('input[name=discount],input[name=cost_shipping]').addEvent('change',function(){
      sumOrderAmount();
    });

    function validProduct(element,msg){
      element=$(element);
      new Element('span.error',{html:msg}).injectAfter(element);
      element.removeEvents('blur').addEvent('blur',function(){
        if(validate(element)) element.removeEvent('blur',arguments.callee);
      });
    }

    function validradio(el,msg){
      el=$E(el);
      var els=el && $ES('input[type=radio][name='+ el.get('name') +']');
      if (!els){
        var tip=new Element('span.error',{html:'请新增收货地址'}).injectAfter($('addrlist').getParent('.gray_form').getElement('strong'));
        tip.destroy.delay(4000,tip);
        MessageBox.error("表单验证失败:请新增收货地址");
        return false;
      }
      if(!els.some(function(radio){return radio.checked === true;})) {
        var tip=new Element('span.error',{html:msg}).injectAfter(el.getParent('.gray_form').getElement('strong'));
        tip.destroy.delay(4000,tip);
        el.focus();
        MessageBox.error("表单验证失败:"+msg);
        return false;
      }
      return true;
    }
  })();
</script>
